import _classCallCheck from "@babel/runtime/helpers/esm/classCallCheck";
import _createClass from "@babel/runtime/helpers/esm/createClass";
import _inherits from "@babel/runtime/helpers/esm/inherits";
import _createSuper from "@babel/runtime/helpers/esm/createSuper";
import _applyDecoratedDescriptor from "@babel/runtime/helpers/esm/applyDecoratedDescriptor";
import _some from "lodash/some";
import _map from "lodash/map";

var _dec, _dec2, _dec3, _dec4, _dec5, _dec6, _dec7, _dec8, _dec9, _dec10, _dec11, _dec12, _dec13, _dec14, _class, _class2;

/**
 * 个人中心 基本信息
 * AccountInfo.js.js
 * @date 2018/11/23

 */
import React from 'react';
import { Avatar, Button, Form, Icon, Input, message, Select, Tooltip } from 'antd';
import { Bind } from 'lodash-decorators';
import { dateRender } from 'utils/renderer';
import intl from 'utils/intl';
import defaultUserAvatar from 'cpaas-front/lib/assets/logo-usercenter-default.png';
import editIcon from "../../assets/userInfo/edit.png";
import Main from "./components/Main";
import Content from "./components/Content";
import Item from "./components/Item";
import AvatarUploadModal from "./components/AvatarUploadModal";
import styles from "./index.less?modules";
import MaxLenItem from "./components/MaxLenItem";
var editWidthStyle = {
  width: 240
};
var btnStyle = {
  marginLeft: 8
};
var AccountInfo = (_dec = Form.create({
  fieldNameProp: null
}), _dec2 = Bind(), _dec3 = Bind(), _dec4 = Bind(), _dec5 = Bind(), _dec6 = Bind(), _dec7 = Bind(), _dec8 = Bind(), _dec9 = Bind(), _dec10 = Bind(), _dec11 = Bind(), _dec12 = Bind(), _dec13 = Bind(), _dec14 = Bind(), _dec(_class = (_class2 = /*#__PURE__*/function (_React$Component) {
  _inherits(AccountInfo, _React$Component);

  var _super = _createSuper(AccountInfo);

  function AccountInfo() {
    var _this;

    _classCallCheck(this, AccountInfo);

    for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
      args[_key] = arguments[_key];
    }

    _this = _super.call.apply(_super, [this].concat(args));
    _this.state = {
      realNameEditing: false,
      avatarUploadProps: {},
      defaultRoleProps: {
        editing: false
      },
      defaultCompanyProps: {
        editing: false
      },
      userAvatar: defaultUserAvatar
    };
    return _this;
  }

  _createClass(AccountInfo, [{
    key: "componentDidMount",
    value: function componentDidMount() {
      var initRoleDataSource = this.props.initRoleDataSource;
      initRoleDataSource();
      var userAvatar = this.props.userInfo && this.props.userInfo.imageUrl;

      if (userAvatar) {
        var img = new Image();
        img.onload = this.updateUserAvatar;
        img.onerror = this.setDefaultUserAvatar;
        img.src = userAvatar;
      }
    }
  }, {
    key: "componentDidUpdate",
    value: function componentDidUpdate(prevProps) {
      var prevUserAvatar = prevProps.userInfo && prevProps.userInfo.imageUrl;
      var nextUserAvatar = this.props.userInfo && this.props.userInfo.imageUrl;

      if (prevUserAvatar !== nextUserAvatar) {
        // 只有当 用户头像存在 才会设置 用户头像
        if (nextUserAvatar) {
          var img = new Image();
          img.onload = this.updateUserAvatar;
          img.onerror = this.setDefaultUserAvatar;
          img.src = nextUserAvatar;
        }
      }
    }
  }, {
    key: "updateUserAvatar",
    value: function updateUserAvatar() {
      var nextUserAvatar = this.props.userInfo && this.props.userInfo.imageUrl;
      this.setState({
        userAvatar: nextUserAvatar
      });
    }
  }, {
    key: "setDefaultUserAvatar",
    value: function setDefaultUserAvatar() {
      this.setState({
        userAvatar: defaultUserAvatar
      });
    }
  }, {
    key: "render",
    value: function render() {
      var _this$props = this.props,
          _this$props$userInfo = _this$props.userInfo,
          userInfo = _this$props$userInfo === void 0 ? {} : _this$props$userInfo,
          imgFormData = _this$props.imgFormData,
          uploadImgName = _this$props.uploadImgName,
          uploadImgPreviewUrl = _this$props.uploadImgPreviewUrl,
          imgUploadStatus = _this$props.imgUploadStatus,
          avatarLoading = _this$props.avatarLoading,
          organizationId = _this$props.organizationId,
          dispatch = _this$props.dispatch;
      var _this$state = this.state,
          realNameEditing = _this$state.realNameEditing,
          avatarUploadProps = _this$state.avatarUploadProps,
          userAvatar = _this$state.userAvatar;
      return /*#__PURE__*/React.createElement("div", {
        className: styles.account
      }, /*#__PURE__*/React.createElement(Main, {
        title: intl.get('ciam.userInfo.view.title.subMain.baseInfo').d('基本信息')
      }, /*#__PURE__*/React.createElement(Content, {
        className: styles['base-info']
      }, /*#__PURE__*/React.createElement("div", {
        className: styles['base-info-left']
      }, /*#__PURE__*/React.createElement("div", {
        className: styles['base-info-avatar']
      }, /*#__PURE__*/React.createElement("div", {
        className: styles['avatar-box'],
        onClick: this.handleAvatarUploadShow
      }, /*#__PURE__*/React.createElement(Avatar, {
        className: styles['head-info-avatar'],
        src: userAvatar,
        size: "large"
      }, userInfo.realName), /*#__PURE__*/React.createElement("div", {
        className: styles['box-content']
      }, /*#__PURE__*/React.createElement(Icon, {
        type: "camera-o",
        className: styles['avatar-uploader-trigger']
      })))), /*#__PURE__*/React.createElement("div", {
        className: styles['base-info-real-name']
      }, realNameEditing ? this.renderRealNameEdit() : this.renderRealName())), /*#__PURE__*/React.createElement("div", {
        className: styles['base-info-right']
      }, /*#__PURE__*/React.createElement(Item, {
        label: intl.get('ciam.userInfo.model.user.loginName').d('账号')
      }, userInfo.loginName), /*#__PURE__*/React.createElement(Item, {
        label: intl.get('cpaas.common.date.active.from').d('有效日期从')
      }, dateRender(userInfo.startDateActive), userInfo.endDateActive && /*#__PURE__*/React.createElement(React.Fragment, null, "\xA0", /*#__PURE__*/React.createElement("span", {
        className: styles['head-info-content-label']
      }, intl.get('ciam.userInfo.model.user.endDateActive').d('至')), "\xA0", dateRender(userInfo.endDateActive)))))), /*#__PURE__*/React.createElement(Main, {
        title: intl.get('ciam.userInfo.view.title.subMain.groupInfo').d('默认集团信息'),
        className: styles.group
      }, /*#__PURE__*/React.createElement(Content, null, this.renderDefaultRole())), avatarUploadProps.avatarVisible && /*#__PURE__*/React.createElement(AvatarUploadModal, Object.assign({}, avatarUploadProps, {
        imgFormData: imgFormData,
        uploadImgName: uploadImgName,
        uploadImgPreviewUrl: uploadImgPreviewUrl,
        imgUploadStatus: imgUploadStatus,
        loading: avatarLoading,
        organizationId: organizationId,
        userInfo: userInfo,
        dispatch: dispatch
      })));
    }
  }, {
    key: "renderRealNameEdit",
    value: function renderRealNameEdit() {
      var _this$props2 = this.props,
          userInfo = _this$props2.userInfo,
          form = _this$props2.form,
          updateRealNameLoading = _this$props2.updateRealNameLoading;
      return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", {
        className: styles['base-info-real-name-edit']
      }, form.getFieldDecorator('realName', {
        initialValue: userInfo.realName,
        rules: [{
          required: true,
          message: intl.get('cpaas.common.validation.notNull', {
            name: intl.get('ciam.userInfo.model.user.realName').d('昵称')
          })
        }, {
          max: 40,
          message: intl.get('cpaas.common.validation.max', {
            max: 40
          })
        }]
      })( /*#__PURE__*/React.createElement(Input, null)), /*#__PURE__*/React.createElement("a", {
        onClick: this.handleRealNameEditCancel,
        style: {
          fontSize: '12px',
          color: '#aaadba',
          marginLeft: '8px'
        }
      }, intl.get('cpaas.common.button.cancel').d('取消')), /*#__PURE__*/React.createElement("a", {
        className: styles['base-info-real-name-edit-save'],
        onClick: this.handleRealNameSave
      }, updateRealNameLoading && /*#__PURE__*/React.createElement(Icon, {
        type: "loading",
        style: {
          marginRight: '2px'
        }
      }), intl.get('cpaas.common.button.save').d('保存'))));
    }
  }, {
    key: "renderRealName",
    value: function renderRealName() {
      var _this$props$userInfo2 = this.props.userInfo,
          userInfo = _this$props$userInfo2 === void 0 ? {} : _this$props$userInfo2;
      return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Tooltip, {
        title: userInfo.realName,
        placement: "bottom",
        className: styles['base-info-real-name-content']
      }, /*#__PURE__*/React.createElement("span", {
        className: styles['base-info-real-name-content']
      }, userInfo.realName)), /*#__PURE__*/React.createElement("a", {
        onClick: this.handleRealNameEdit
      }, /*#__PURE__*/React.createElement("img", {
        src: editIcon,
        alt: "edit",
        width: "14px",
        height: "14px"
      })));
    }
  }, {
    key: "renderDefaultRole",
    value: function renderDefaultRole() {
      var _this$props3 = this.props,
          _this$props3$userInfo = _this$props3.userInfo,
          userInfo = _this$props3$userInfo === void 0 ? {} : _this$props3$userInfo,
          _this$props3$roleData = _this$props3.roleDataSource,
          roleDataSource = _this$props3$roleData === void 0 ? [] : _this$props3$roleData,
          form = _this$props3.form,
          updateRoleLoading = _this$props3.updateRoleLoading;
      var _this$state$defaultRo = this.state.defaultRoleProps.editing,
          editing = _this$state$defaultRo === void 0 ? false : _this$state$defaultRo;
      var content;
      var comment = intl.get('ciam.userInfo.view.message.role').d('登录云平台时默认使用的角色');
      var btns = [];

      if (editing) {
        // comment = '';
        var roleOptions = _map(roleDataSource, function (role) {
          return /*#__PURE__*/React.createElement(Select.Option, {
            key: role.id,
            value: role.id
          }, role.name);
        });

        content = /*#__PURE__*/React.createElement(React.Fragment, null, form.getFieldDecorator('defaultRole', {
          initialValue: userInfo.defaultRoleId
        })( /*#__PURE__*/React.createElement(Select, {
          allowClear: true,
          style: editWidthStyle
        }, roleOptions)), /*#__PURE__*/React.createElement(Button, {
          style: btnStyle,
          onClick: this.handleDefaultRoleEditCancel
        }, intl.get('cpaas.common.button.cancel').d('取消')), /*#__PURE__*/React.createElement(Button, {
          type: "primary",
          style: btnStyle,
          loading: updateRoleLoading,
          onClick: this.handleDefaultRoleUpdate
        }, intl.get('cpaas.common.button.save').d('保存')));
      } else {
        content = userInfo.defaultRoleName || '';
        btns.push( /*#__PURE__*/React.createElement(Button, {
          key: "update",
          onClick: this.handleDefaultRoleEdit
        }, intl.get('cpaas.common.button.update').d('修改')));
      }

      return /*#__PURE__*/React.createElement(MaxLenItem, {
        key: "default-role",
        itemIcon: null,
        descriptions: intl.get('ciam.userInfo.model.user.defaultRole').d('默认角色'),
        content: content,
        comment: comment,
        btns: btns
      });
    }
  }, {
    key: "renderDefaultCompany",
    value: function renderDefaultCompany() {
      var _this$props4 = this.props,
          _this$props4$userInfo = _this$props4.userInfo,
          userInfo = _this$props4$userInfo === void 0 ? {} : _this$props4$userInfo,
          _this$props4$companyD = _this$props4.companyDataSource,
          companyDataSource = _this$props4$companyD === void 0 ? [] : _this$props4$companyD,
          form = _this$props4.form,
          updateCompanyLoading = _this$props4.updateCompanyLoading;
      var _this$state$defaultCo = this.state.defaultCompanyProps.editing,
          editing = _this$state$defaultCo === void 0 ? false : _this$state$defaultCo;

      var curCompanyCanAssign = _some(companyDataSource, function (company) {
        return company.companyId === userInfo.defaultCompanyId;
      });

      var content;
      var comment = intl.get('ciam.userInfo.view.message.company').d('在云平台平台内根据权限分配的公司中的默认公司选项');
      var btns = [];

      if (editing) {
        // comment = '';
        var companyOptions = _map(companyDataSource, function (company) {
          return /*#__PURE__*/React.createElement(Select.Option, {
            key: company.companyId,
            value: company.companyId
          }, company.companyName);
        });

        content = /*#__PURE__*/React.createElement(React.Fragment, null, form.getFieldDecorator('defaultCompany', {
          initialValue: curCompanyCanAssign ? userInfo.defaultCompanyId : undefined
        })( /*#__PURE__*/React.createElement(Select, {
          allowClear: true,
          style: editWidthStyle
        }, companyOptions)), /*#__PURE__*/React.createElement(Button, {
          style: btnStyle,
          onClick: this.handleDefaultCompanyEditCancel
        }, intl.get('cpaas.common.button.cancel').d('取消')), /*#__PURE__*/React.createElement(Button, {
          type: "primary",
          style: btnStyle,
          loading: updateCompanyLoading,
          onClick: this.handleDefaultCompanyUpdate
        }, intl.get('cpaas.common.button.save').d('保存')));
      } else {
        content = curCompanyCanAssign ? userInfo.defaultCompanyName || '' : '';
        btns.push( /*#__PURE__*/React.createElement(Button, {
          key: "update",
          onClick: this.handleDefaultCompanyEdit
        }, intl.get('cpaas.common.button.update').d('修改')));
      }

      return /*#__PURE__*/React.createElement(MaxLenItem, {
        key: "default-company",
        itemIcon: null,
        descriptions: intl.get('ciam.userInfo.model.user.defaultCompany').d('默认公司'),
        content: content,
        comment: comment,
        btns: btns
      });
    } // role

  }, {
    key: "handleDefaultRoleEdit",
    value: function handleDefaultRoleEdit() {
      this.setState({
        defaultRoleProps: {
          editing: true
        }
      });
    }
  }, {
    key: "handleDefaultRoleEditCancel",
    value: function handleDefaultRoleEditCancel() {
      var form = this.props.form;
      form.resetFields(['defaultRole']);
      this.setState({
        defaultRoleProps: {
          editing: false
        }
      });
    }
  }, {
    key: "handleDefaultRoleUpdate",
    value: function handleDefaultRoleUpdate() {
      var _this2 = this;

      var _this$props5 = this.props,
          form = _this$props5.form,
          onDefaultRoleSave = _this$props5.onDefaultRoleSave;
      form.validateFields(['defaultRole'], function (err, data) {
        if (!err) {
          onDefaultRoleSave(data.defaultRole).then(function (res) {
            if (res) {
              form.resetFields(['defaultRole']);

              _this2.handleDefaultRoleEditCancel();
            }
          });
        }
      });
    } // company

  }, {
    key: "handleDefaultCompanyEdit",
    value: function handleDefaultCompanyEdit() {
      this.setState({
        defaultCompanyProps: {
          editing: true
        }
      });
    }
  }, {
    key: "handleDefaultCompanyEditCancel",
    value: function handleDefaultCompanyEditCancel() {
      this.setState({
        defaultCompanyProps: {
          editing: false
        }
      });
    }
  }, {
    key: "handleDefaultCompanyUpdate",
    value: function handleDefaultCompanyUpdate() {
      var _this3 = this;

      var _this$props6 = this.props,
          form = _this$props6.form,
          onDefaultCompanySave = _this$props6.onDefaultCompanySave;
      form.validateFields(['defaultCompany'], function (err, data) {
        if (!err) {
          onDefaultCompanySave(data.defaultCompany).then(function (res) {
            if (res) {
              form.resetFields(['defaultCompany']);

              _this3.handleDefaultCompanyEditCancel();
            }
          });
        }
      });
    } // real-name

  }, {
    key: "handleRealNameEdit",
    value: function handleRealNameEdit() {
      this.setState({
        realNameEditing: true
      });
    }
  }, {
    key: "handleRealNameEditCancel",
    value: function handleRealNameEditCancel() {
      this.setState({
        realNameEditing: false
      });
    }
  }, {
    key: "handleRealNameSave",
    value: function handleRealNameSave(e) {
      var _this4 = this;

      e.preventDefault();
      var _this$props7 = this.props,
          onSaveRealName = _this$props7.onSaveRealName,
          form = _this$props7.form;
      form.validateFields(['realName'], function (err, data) {
        if (err) {
          var errorMessage = '';
          err.realName.errors.forEach(function (er) {
            errorMessage += er.message;
          });
          message.error(errorMessage);
        } else {
          onSaveRealName(data.realName).then(function (res) {
            if (res) {
              _this4.setState({
                realNameEditing: false
              });
            }
          });
        }
      });
    } // avatar

  }, {
    key: "handleAvatarUploadShow",
    value: function handleAvatarUploadShow(e) {
      e.preventDefault();
      this.setState({
        avatarUploadProps: {
          avatarVisible: true,
          onOk: this.handleAvatarUploadHidden,
          onCancel: this.handleAvatarUploadHidden
        }
      });
    }
  }, {
    key: "handleAvatarUploadHidden",
    value: function handleAvatarUploadHidden() {
      var dispatch = this.props.dispatch;
      this.setState({
        avatarUploadProps: {
          visible: false
        }
      });
      dispatch({
        type: 'userInfo/updateState',
        payload: {
          uploadImgPreviewUrl: '',
          uploadImgName: ''
        }
      });
    }
  }]);

  return AccountInfo;
}(React.Component), (_applyDecoratedDescriptor(_class2.prototype, "updateUserAvatar", [_dec2], Object.getOwnPropertyDescriptor(_class2.prototype, "updateUserAvatar"), _class2.prototype), _applyDecoratedDescriptor(_class2.prototype, "setDefaultUserAvatar", [_dec3], Object.getOwnPropertyDescriptor(_class2.prototype, "setDefaultUserAvatar"), _class2.prototype), _applyDecoratedDescriptor(_class2.prototype, "handleDefaultRoleEdit", [_dec4], Object.getOwnPropertyDescriptor(_class2.prototype, "handleDefaultRoleEdit"), _class2.prototype), _applyDecoratedDescriptor(_class2.prototype, "handleDefaultRoleEditCancel", [_dec5], Object.getOwnPropertyDescriptor(_class2.prototype, "handleDefaultRoleEditCancel"), _class2.prototype), _applyDecoratedDescriptor(_class2.prototype, "handleDefaultRoleUpdate", [_dec6], Object.getOwnPropertyDescriptor(_class2.prototype, "handleDefaultRoleUpdate"), _class2.prototype), _applyDecoratedDescriptor(_class2.prototype, "handleDefaultCompanyEdit", [_dec7], Object.getOwnPropertyDescriptor(_class2.prototype, "handleDefaultCompanyEdit"), _class2.prototype), _applyDecoratedDescriptor(_class2.prototype, "handleDefaultCompanyEditCancel", [_dec8], Object.getOwnPropertyDescriptor(_class2.prototype, "handleDefaultCompanyEditCancel"), _class2.prototype), _applyDecoratedDescriptor(_class2.prototype, "handleDefaultCompanyUpdate", [_dec9], Object.getOwnPropertyDescriptor(_class2.prototype, "handleDefaultCompanyUpdate"), _class2.prototype), _applyDecoratedDescriptor(_class2.prototype, "handleRealNameEdit", [_dec10], Object.getOwnPropertyDescriptor(_class2.prototype, "handleRealNameEdit"), _class2.prototype), _applyDecoratedDescriptor(_class2.prototype, "handleRealNameEditCancel", [_dec11], Object.getOwnPropertyDescriptor(_class2.prototype, "handleRealNameEditCancel"), _class2.prototype), _applyDecoratedDescriptor(_class2.prototype, "handleRealNameSave", [_dec12], Object.getOwnPropertyDescriptor(_class2.prototype, "handleRealNameSave"), _class2.prototype), _applyDecoratedDescriptor(_class2.prototype, "handleAvatarUploadShow", [_dec13], Object.getOwnPropertyDescriptor(_class2.prototype, "handleAvatarUploadShow"), _class2.prototype), _applyDecoratedDescriptor(_class2.prototype, "handleAvatarUploadHidden", [_dec14], Object.getOwnPropertyDescriptor(_class2.prototype, "handleAvatarUploadHidden"), _class2.prototype)), _class2)) || _class);
export { AccountInfo as default };